<template>
<div>
    <a-modal
    v-model:visible="visible"
    :width="900"
    
    >
    <template #title>
        <h3>试验历史数据</h3>
      </template>
        <div class="main">
            <a-row class="top-title">
                <a-col :span="4">编号：{{ number }}</a-col>
                <a-col :span="4">规格型号：{{ model }}</a-col>
                <a-col :span="4">保管人：{{ keeper }}</a-col>
            </a-row>
            <a-table :columns="columns" :data-source="data" class="table">
                <template #bodyCell="{ column, text }">
                    <template v-if="column.dataIndex === 'name'">
                        <a>{{ text }}</a>
                    </template>
                </template>
            </a-table>
        </div>
        <template #footer>
            <a-button key="close" type="primary" @click="handleOk">关闭</a-button>
      </template>
    </a-modal>
</div>
</template>

<script setup>
import { ref } from 'vue';
import request from '@/utils/request'

const number=ref()
const model=ref()
const keeper=ref('')

const visible = ref(false);
const columns = [{
  title: '试验日期',
  dataIndex: 'testDate',
  key: 'testDate',
}, {
  title: '有效截止日期',
  dataIndex: 'expireDate',
  key: 'expireDate',
}, {
  title: '试验人',
  dataIndex: 'tester ',
  key: 'tester ',
}, {
  title: '审核人',
  dataIndex: 'auditor',
  key: 'auditor',
}, {
  title: '投运日期',
  dataIndex: 'operateDate',
  key: 'operateDate',
}, {
  title: '试验结论',
  dataIndex: 'operateConclusion',
  key: 'operateConclusion',
}];
const data =ref([]);

const showModal = async(record) => {
  number.value=record.number
  keeper.value=record.keeper
  model.value=record.specification
// console.log(record)
const result=await request({
  url:'/scrap/historylist',
  method:'get',
  params:{
    toolid:record.toolid
  }
})
data.value=result.data.data
console.log(result)
    visible.value = true;
};
const handleOk = e => {
    console.log(e);
    visible.value = false;
};
    
defineExpose({
    showModal,
})

</script>
<style lang="less">
.full-modal {
    .ant-modal {
        max-width: 100%;
        top: 0;
        padding-bottom: 0;
        margin: 0;
    }
    .ant-modal-content {
        display: flex;
        flex-direction: column;
        height: calc(100vh);
    }
    .ant-modal-body {
        flex: 1;
    }
    .main{
      padding: 20px ;
      .top-title{
        padding-left: 10px;
      }
    }
    h3{
        display: inline-block;
        font-weight: 900;
    }
    .table{
        padding-top: 40px;
    }
}

</style>